<template>
	<view class="common-btn" @click="onClickListener">
		<image class="right"></image>
		<text>{{ title }}</text>
		<image class="left"></image>
	</view>
</template>

<script>
export default {
	name: 'common-button',
	props: {
		title: {
			type: String,
			default: undefined
		}
	},
	data() {
		return {};
	},
	methods: {
		onClickListener() {
			this.$emit('click');
		}
	}
};
</script>

<style lang="scss" scoped>
.common-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	background-image: url('https://sitiantech.com/memorial-hall/profile/static/image/common/bg_common_btn.svg?v20220826');
	background-size: 100% 100%;
	height: 91.12rpx;
	image {
		width: 40.3rpx;
		height: 28.04rpx;
	}
	text {
		color: #ffffff;
		font-weight: bold;
		margin: 0 28.04rpx;
		font-size: 26.28rpx;
	}
	.left {
		content: url('https://sitiantech.com/memorial-hall/profile/static/image/common/icon_common_arrow_left.svg?v20220826');
	}
	.right {
		content: url('https://sitiantech.com/memorial-hall/profile/static/image/common/icon_common_arrow_right.svg?v20220826');
	}
}
</style>
